<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title></title>
		<style type="text/css">
			canvas {
				width: 1000px;
				height: 700px;
				border: 10px;
			}
		</style>
	</head>

	<body>
		<canvas id="Mycanvas" width="1000px" height="700px" style="border: 10px solid;"></canvas>
		<script type="text/javascript">
			//获取画布
			var canvas = document.getElementById("Mycanvas");
			//创建画笔
			var cxt = canvas.getContext("2d");
			cxt.fillStyle = "blue";
			cxt.fillRect(0, 0, 1000, 700);
			//画太阳
			cxt.fillStyle = "yellow"
			cxt.beginPath();
			cxt.arc(15, 18, 60, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "#FF0000";
			cxt.beginPath();
			cxt.arc(15, 18, 50, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			
			//云彩
			cxt.fillStyle = "white"
			cxt.beginPath();
			cxt.arc(150,135,43, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.fillStyle = "white"
			cxt.beginPath();
			cxt.arc(200,140,46, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.fillStyle = "white";
			cxt.beginPath();
			cxt.arc(100, 160, 40, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.fillStyle = "white";
			cxt.beginPath();
			cxt.arc(240, 160, 35, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();

			//画彩虹
			cxt.fillStyle = "#FF0000";
			cxt.beginPath();
			cxt.arc(350, 600, 350, 0, Math.PI, true);
			cxt.closePath();
			cxt.fill();

			cxt.fillStyle = "yellow";
			cxt.beginPath();
			cxt.arc(350, 600, 320, 0, Math.PI, true);
			cxt.closePath();
			cxt.fill();

			cxt.fillStyle = "green";
			cxt.beginPath();
			cxt.arc(350, 600, 290, 0, Math.PI, true);
			cxt.closePath();
			cxt.fill();

			cxt.fillStyle = "blue";
			cxt.beginPath();
			cxt.arc(350, 600, 260, 0, Math.PI, true);
			cxt.closePath();
			cxt.fill();

			cxt.fillStyle = "purple";
			cxt.beginPath();
			cxt.arc(350, 600, 230, 0, Math.PI, true);
			cxt.closePath();
			cxt.fill();

			//房子
			//三角
			cxt.fillStyle = "deeppink";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(350, 100);
			cxt.lineTo(400, 200);
			cxt.lineTo(300, 200);
			cxt.lineTo(350, 100);
			cxt.closePath();
			cxt.fill();	
			cxt.stroke();
            //上方主房
			cxt.fillStyle = "deepskyblue";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(300, 200);
			cxt.lineTo(400, 200);
			cxt.lineTo(400,400);
			cxt.lineTo(300, 400);
			cxt.lineTo(300, 200);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();

			//上方上窗户
			cxt.fillStyle = "greenyellow";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(320,220);
			cxt.lineTo(320,280);
			cxt.lineTo(380,280);
			cxt.lineTo(380,220);
			cxt.lineTo(320,220);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(320,250);
			cxt.lineTo(380,250);
			cxt.lineTo(320,250);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(350,220);
			cxt.lineTo(350,280);
			cxt.lineTo(350,220);
			cxt.closePath();
			cxt.stroke();

			//上方下窗户
			cxt.fillStyle = "greenyellow";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(320,320);
			cxt.lineTo(320,380);
			cxt.lineTo(380,380);
			cxt.lineTo(380,320);
			cxt.lineTo(320,320);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(320,350);
			cxt.lineTo(380,350);
			cxt.lineTo(320,350);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(350,320);
			cxt.lineTo(350,380);
			cxt.lineTo(350,320);
			cxt.closePath();

			cxt.stroke();
			
			
			//右上方小房子
			cxt.fillStyle = "deepskyblue";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(400,350);
			cxt.lineTo(450,350);
			cxt.lineTo(450,250);
			cxt.lineTo(400,250);
			cxt.lineTo(400,350);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "deeppink";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(400,250);
			cxt.lineTo(450,250);
			cxt.lineTo(425,200);
			cxt.lineTo(400,250);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "greenyellow";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(420,270);
			cxt.lineTo(420,330);
			cxt.lineTo(450,330);
			cxt.lineTo(450,270);
			cxt.lineTo(420,270);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			//左上方小房子
			cxt.fillStyle = "deepskyblue";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(250,350);
			cxt.lineTo(300,350);
			cxt.lineTo(300,250);
			cxt.lineTo(250,250);
			cxt.lineTo(250,350);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "deeppink";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(250,250);
			cxt.lineTo(300,250);
			cxt.lineTo(275,200);
			cxt.lineTo(250,250);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "greenyellow";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(250,270);
			cxt.lineTo(250,330);
			cxt.lineTo(280,330);
			cxt.lineTo(280,270);
			cxt.lineTo(250,270);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			//下方主房
			cxt.fillStyle = "deeppink";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(300,350);
			cxt.lineTo(300,400);
			cxt.lineTo(400,400);
			cxt.lineTo(400,350);
			cxt.lineTo(450,350);
			cxt.lineTo(450,600);
			cxt.lineTo(250,600);
			cxt.lineTo(250,350);
			cxt.lineTo(300,350);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "deepskyblue";
			cxt.beginPath();
			cxt.moveTo(250,420);
			cxt.lineTo(450,420);
			cxt.lineTo(450,600);
			cxt.lineTo(250,600);
			cxt.lineTo(250,420);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			
			//下方下窗户
			cxt.fillStyle = "greenyellow";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(270,440);
			cxt.lineTo(270,490);
			cxt.lineTo(320,490);
			cxt.lineTo(320,440);
			cxt.lineTo(270,440);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(270,465);
			cxt.lineTo(320,465);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(295,440);
			cxt.lineTo(295,490);
			cxt.closePath();
			cxt.stroke();
			
			//下方右窗户
			cxt.fillStyle = "greenyellow";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(380,440);
			cxt.lineTo(380,490);
			cxt.lineTo(430,490);
			cxt.lineTo(430,440);
			cxt.lineTo(380,440);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(380,465);
			cxt.lineTo(430,465);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(405,440);
			cxt.lineTo(405,490);
			cxt.closePath();
			cxt.stroke();
			//			cxt.fill();
			
			//下方门
			cxt.fillStyle = "greenyellow";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(300,600);
			cxt.lineTo(400,600);
			cxt.lineTo(400,530);
			cxt.lineTo(300,530);
			cxt.lineTo(300,600);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(380,465);
			cxt.lineTo(430,465);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(405,440);
			cxt.lineTo(405,490);
			cxt.closePath();
			cxt.stroke();
			
			//门上半圆
			cxt.fillStyle = "deeppink"
			cxt.beginPath();
			cxt.arc(325, 530, 25, 0, Math.PI, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "deeppink"
			cxt.beginPath();
			cxt.arc(375, 530, 25, 0, Math.PI, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(350,600);
			cxt.lineTo(350,530);
			cxt.closePath();
			cxt.stroke();
			//			cxt.fill();
			
			//下方右小房子
			cxt.fillStyle = "deepskyblue";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(450,600);
			cxt.lineTo(550,600);
			cxt.lineTo(550,400);
			cxt.lineTo(450,400);
			cxt.lineTo(450,600);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "deeppink";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(450,400);
			cxt.lineTo(550,400);
			cxt.lineTo(500,320);
			cxt.lineTo(450,400);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			
			//窗户
			cxt.fillStyle = "greenyellow";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(470,420);
			cxt.lineTo(530,420);
			cxt.lineTo(530,580);
			cxt.lineTo(470,580);
			cxt.lineTo(470,420);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(470,460);
			cxt.lineTo(530,460);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(470,500);
			cxt.lineTo(530,500);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(470,540);
			cxt.lineTo(530,540);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(500,420);
			cxt.lineTo(500,580);
			cxt.closePath();
			cxt.stroke();
			
			//左下房子
			//下方右小房子
			cxt.fillStyle = "deepskyblue";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(150,600);
			cxt.lineTo(250,600);
			cxt.lineTo(250,400);
			cxt.lineTo(150,400);
			cxt.lineTo(150,600);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "deeppink";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(150,400);
			cxt.lineTo(250,400);
			cxt.lineTo(200,320);
			cxt.lineTo(150,400);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();

			//窗户
			cxt.fillStyle = "greenyellow";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(170,420);
			cxt.lineTo(230,420);
			cxt.lineTo(230,580);
			cxt.lineTo(170,580);
			cxt.lineTo(170,420);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(170,460);
			cxt.lineTo(230,460);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(170,500);
			cxt.lineTo(230,500);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(170,540);
			cxt.lineTo(230,540);
			cxt.closePath();
			cxt.stroke();
			cxt.beginPath();
			cxt.moveTo(200,420);
			cxt.lineTo(200,580);
			cxt.closePath(); 
			cxt.stroke();
			
			//草丛
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(0,600);
			cxt.lineTo(1000,600);
			cxt.lineTo(1000,700);
			cxt.lineTo(0,700);
			cxt.lineTo(0,600);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			
			//shu
			cxt.fillStyle = "saddlebrown";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(1000,700);
			cxt.lineTo(900,700);
			cxt.lineTo(900,300);
			cxt.lineTo(1000,300);
			cxt.lineTo(1000,700);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "darkgreen"
			cxt.beginPath();
			cxt.arc(1000, 0, 400, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "red"
			cxt.beginPath();
			cxt.arc(800,50, 30,0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "red"
			cxt.beginPath();
			cxt.arc(950,150, 30,0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "red"
			cxt.beginPath();
			cxt.arc(850,250, 30,0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "red"
			cxt.beginPath();
			cxt.arc(1000,10, 30,0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "red"
			cxt.beginPath();
			cxt.arc(800,50, 30,0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "red"
			cxt.beginPath();
			cxt.arc(700,8, 30,0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "red"
			cxt.beginPath();
			cxt.arc(850,125, 50,0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "red"
			cxt.beginPath();
			cxt.arc(750,150, 30,0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "red"
			cxt.beginPath();
			cxt.arc(800,650, 30,0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "red"
			cxt.beginPath();
			cxt.arc(750,700, 30,0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "27px";
			cxt.beginPath();
			cxt.moveTo(930,500);
			cxt.lineTo(920,580);
			cxt.closePath();
			cxt.stroke();
			
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "27px";
			cxt.beginPath();
			cxt.moveTo(920,540);
			cxt.lineTo(915,570);
			cxt.closePath();
			cxt.stroke();
			
			//我
			//身体
			cxt.fillStyle = "red";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(750,490);
			cxt.lineTo(710,570);
			cxt.lineTo(790,570);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			//tou
			cxt.fillStyle = "burlywood"
			cxt.beginPath();
			cxt.arc(750,460,30, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			//tui
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "27px";
			cxt.beginPath();
			cxt.moveTo(740,600);
			cxt.lineTo(740,570);
			cxt.stroke();
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "27px";
			cxt.beginPath();
			cxt.moveTo(760,600);
			cxt.lineTo(760,570);
			cxt.stroke();
			//shou
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "27px";
			cxt.beginPath();
			cxt.moveTo(740,510);
			cxt.lineTo(700,510);
			cxt.stroke();
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "27px";
			cxt.beginPath();
			cxt.moveTo(760,510);
			cxt.lineTo(800,510);
			cxt.stroke();
			//toufa
			cxt.fillStyle = "black"
			cxt.beginPath();
			cxt.arc(715,445,10, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "black"
			cxt.beginPath();
			cxt.arc(785,445,10, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			//yan
			cxt.fillStyle = "white"
			cxt.beginPath();
			cxt.arc(740,450,7, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "black"
			cxt.beginPath();
			cxt.arc(740,450,5, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "white"
			cxt.beginPath();
			cxt.arc(760,450,7, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "black"
			cxt.beginPath();
			cxt.arc(760,450,5, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			//zui
			cxt.fillStyle = "red";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(745,470);
			cxt.lineTo(755,470);
			cxt.lineTo(748,479);
			cxt.lineTo(752,479);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			
			//ni
			//身体
			cxt.fillStyle = "indigo";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(850,490);
			cxt.lineTo(810,570);
			cxt.lineTo(890,570);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			//tou
			cxt.fillStyle = "burlywood"
			cxt.beginPath();
			cxt.arc(850,460,30, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			//tui
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "27px";
			cxt.beginPath();
			cxt.moveTo(840,600);
			cxt.lineTo(840,570);
			cxt.stroke();
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "27px";
			cxt.beginPath();
			cxt.moveTo(860,600);
			cxt.lineTo(860,570);
			cxt.stroke();
			//shou
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "27px";
			cxt.beginPath();
			cxt.moveTo(840,510);
			cxt.lineTo(800,510);
			cxt.stroke();
			cxt.fillStyle = "darkgreen";
			cxt.lineWidth = "27px";
			cxt.beginPath();
			cxt.moveTo(860,510);
			cxt.lineTo(900,510);
			cxt.stroke();
			//toufa
			cxt.fillStyle = "black"
			cxt.beginPath();
			cxt.arc(815,445,10, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "black"
			cxt.beginPath();
			cxt.arc(885,445,10, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			//yan
			cxt.fillStyle = "white"
			cxt.beginPath();
			cxt.arc(840,450,7, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "black"
			cxt.beginPath();
			cxt.arc(840,450,5, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "white"
			cxt.beginPath();
			cxt.arc(860,450,7, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			cxt.fillStyle = "black"
			cxt.beginPath();
			cxt.arc(860,450,5, 0, Math.PI * 2, true);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
			//zui
			cxt.fillStyle = "red";
			cxt.lineWidth = "7px";
			cxt.beginPath();
			cxt.moveTo(845,470);
			cxt.lineTo(855,470);
			cxt.lineTo(848,479);
			cxt.lineTo(852,479);
			cxt.closePath();
			cxt.fill();
			cxt.stroke();
		</script>
	</body>

</html>